$(function () {
  // 点击按钮触发 file 标签的点击事件
  $('#btnChooseImg').on('click', function (e) {
    $('#file').click()
  })
  let file = null
  // 监听文件选择框的 change 事件
  $('#file').on('change', function (e) {
    let files = e.target.files
    if (files.length == 0) {
      file = null
      return
    }

    file = files[0]

    // URL.createObjectURL() 函数接收一个文件,返回值是这个文件的 URL 地址
    let imgURL = URL.createObjectURL(files[0])
    $('#image').attr('src', imgURL)
  })

  // 上传头像功能
  $('#btnUploadImg').on('click', function () {
    if (!file) {
      layer.msg('请先选择要上传的文件')
      return
    }
    let fr = new FileReader()
    // 配合 fr.result 获得图片的 base64 
    fr.readAsDataURL(file)
    fr.addEventListener('load', function () {
      axios.patch('/my/update/avatar', { avatar: fr.result }).then(({ data: res }) => {
        if (res.code == 0) {
          window.parent.initUserInfo()
          layer.msg('更新头像成功', { icon: 1 })
        }
      })
    })
  })
})